<template>
	<view class="content">
		<view class="List headers" v-if="userinfo">
			<view class="top">
				<view class="avator">
					<image :src="userinfo.avatar" mode=""></image>
				</view>
				<view class="avator_block" style="width: 190rpx;height: 120rpx;">

				</view>
				<view class="name"
					style="padding-top: 20rpx;width: 460rpx;display: flex;justify-content: space-between;font-weight: bold;font-size: 30rpx;">
					<text style="padding-left: 5rpx;">{{ userinfo.nickname }}
						<text style="font-weight: 600;font-size: 28rpx;color: #999;padding-left: 20rpx;"
							v-if="userinfo.status=='normal'">(正常)</text>
						<text style="font-weight: 600;font-size: 28rpx;color: #999;padding-left: 20rpx;"
							v-if="userinfo.status == 'hidden'">(审核中)</text>
					</text>
					<!-- <text style="padding: 5rpx 0rpx;" @click="Setting"
						class="gui-icons gui-block gui-color-gray gui-text">&#xe613;</text> -->
				</view>

			</view>

			<view class="type" style="padding: 0 35rpx;display: flex;align-items: center;">
				<text style="font-size: 30rpx;color: #747474;">
					产品信息管理系统
				</text>
				<text style="padding: 0 10rpx;" class="gui-icons gui-block gui-color-gray gui-text">&#xe601;</text>
				<text class="sf">
					员工
				</text>
			</view>
		</view>
		<view class="List headers" v-else @click="login">
			<view class="top">
				<view class="avator">
					<image :src="url + configinfo.image" mode=""></image>
				</view>
				<view class="avator_block" style="width: 190rpx;height: 120rpx;">

				</view>
				<view class="name"
					style="padding-top: 20rpx;width: 460rpx;display: flex;justify-content: space-between;font-weight: bold;font-size: 30rpx;">
					<text style="padding-left: 5rpx;">请先登录</text>
					<text style="padding: 5rpx 0rpx;"
						class="gui-icons gui-block gui-color-gray gui-text">&#xe613;</text>
				</view>
			</view>
			<view class="type" style="padding: 0 35rpx;display: flex;align-items: center;">
				<text style="font-size: 30rpx;color: #747474;">
					{{ configinfo.name }}
				</text>
			</view>
		</view>
		<view class="outlogin" @click="outlogin">
			退出登录
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				url: '',
				configinfo: '',
				userinfo: '',
				List: [{
						"name": "下载模板",
						"img": '../../static/down.png',
						"type": '1',
						"url": '/pages/file/down'
					},
					{
						"name": "模板上传",
						"img": '../../static/up.png',
						"type": '1',
						"url": '/pages/file/up'
					},
				],
			}
		},
		onLoad() {},
		onShow() {
			if (uni.getStorageSync('token')) {
				this.userinfo = uni.getStorageSync('userinfo')
			} else {
				uni.showToast({
					title: '请先登录',
					icon: 'none'
				})
				setTimeout(res => {
					uni.reLaunch({
						url: '/pages/login/index'
					})
				}, 600)
			}
		},
		methods: {
			config() {
				this.$http.Post('index/config', {

				}, (result) => {
					this.configinfo = result.data
					this.url = this.configinfo.url
				})
			},
			login() {
				uni.navigateTo({
					url: '/pages/login/login'
				})
			},
			outlogin() {
				uni.removeStorageSync('token')
				uni.removeStorageSync('userinfo')
				uni.removeStorageSync('msg')
				uni.showToast({
					title: '退出登录',
					icon: 'success'
				})
				setTimeout(res => {
					uni.reLaunch({
						url: '/pages/login/index'
					})
				}, 500)
			},
			Setting() {
				uni.navigateTo({
					url: '/pages/my/cz'
				})

			},
			GetUserinfo() {
				this.$http.Post('user/info', {

				}, (result) => {
					if (result.code == 1) {
						this.userinfo = result.data
						uni.setStorageSync('userinfo', this.userinfo)
					}
				})
			},
			Gourl(list) {
				if (!uni.getStorageSync('token')) {
					uni.showToast({
						title: '请先登录',
						icon: 'none'
					})
					setTimeout(res => {
						uni.navigateTo({
							url: '/pages/login/login'
						})
					}, 500)
					return
				}
				uni.navigateTo({
					url: list.url
				})
			}
		}
	}
</script>

<style>
	page {
		background-color: #f6f6f6;
	}
</style>
<style scoped>
	.content {
		padding: 0rpx 35rpx;
	}

	.headers {
		padding-bottom: 30rpx !important;
		margin-top: 20rpx !important;
		border-radius: 12rpx;
		background-color: #fff;
	}

	.title {
		width: 92%;
		margin: 30rpx auto 20rpx auto;
		color: #08ad08;
		font-weight: bold;
	}

	.top {
		position: relative;
		width: 100%;
		display: flex;
	}

	.avator {
		position: absolute;
		top: -35rpx;
		left: 50rpx;
		width: 120rpx;
		height: 120rpx;
		border-radius: 12rpx;
		background-color: #fff;
	}

	.avator>image {
		width: 100%;
		height: 100%;
		border-radius: 12rpx;
	}

	.List {
		border-radius: 12rpx;
		margin: 20rpx 0;
		width: 100%;
		background-color: #fff;
		padding: 10rpx;
	}

	.item {
		width: 100%;
		height: 100rpx;
		display: flex;
		align-items: center;
	}

	.new_item {
		border-bottom: 1rpx solid #f6f6f6;
	}

	.item_icon {
		width: 15%;
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.item_icon>image {
		width: 50rpx;
		height: 50rpx;
	}

	.item_name {
		font-size: 28rpx;
		color: #003c3e;
		width: 75%;
		height: 100%;
		display: flex;
		align-items: center;
	}

	.item_right {
		height: 100%;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 10%;
	}

	.sf {
		border-radius: 6rpx;
		padding: 4rpx 10rpx;
		font-size: 24rpx;
		color: #959497;
		border: 1rpx solid #F1F8E9;
		box-shadow: rgba(0, 0, 0, 0.16) 0px 1rpx 4rpx;
	}

	.outlogin {
		width: 100%;
		display: flex;
		height: 90rpx;
		justify-content: center;
		align-items: center;
		color: #003c3e;
		font-size: 28rpx;
		background-color: #fff;
	}

	.idcr {
		font-weight: bold;
		color: #aaaaf8;
		margin-top: 60rpx;
		font-size: 36rpx;
	}
</style>